import useStore from '@/store';
import { WindowType } from '@/types/global/window';
//import { storeToRefs } from 'pinia';
import { computed, onMounted, ref } from 'vue';

//let { windows, currentWindowName, lastWindowName } = storeToRefs(useStore.window);

export default (window: WindowType, windowRef: any) => {
  const active = computed(() => {
    return useStore.window.currentWindowName === window.name;
  });
  const width = ref(window.width ?? 800);
  const height = ref(window.height ?? 600);
  const left = ref(0);
  const top = ref(0);
  const init = () => {
    windowRef.value.style.width = width.value + 'px';
    windowRef.value.style.height = height.value + 'px';
    // window.onresize = () =>
    //   (() => {
    //     //onresize();
    //   })();
    left.value = (document.body.offsetWidth - windowRef.value.clientWidth) / 2;
    top.value = (document.body.offsetHeight - windowRef.value.clientHeight) / 2;
    windowRef.value.style.left = left.value + 'px';
    windowRef.value.style.top = top.value + 'px';
  };
  /**
   * 最大化(还原)窗口
   */
  const maximize = () => {
    window.maximize = !window.maximize;
    //最大化动画
    windowRef.value.style.transition = 'all 0.14s linear';
    if (window.maximize) {
      left.value = parseInt(windowRef.value.style.left);
      top.value = parseInt(windowRef.value.style.top);
      //const bottomHeight = window.document.body.clientHeight - props.target.clientHeight;
      // paner.value.style.width = props.target.clientWidth + 'px';
      windowRef.value.style.width = '100%';
      windowRef.value.style.height = '100%';
      // paner.value.style.height = props.target.clientHeight - bottomHeight + 'px';
      windowRef.value.style.left = '0';
      windowRef.value.style.top = '0';
    } else {
      windowRef.value.style.height = height.value + 'px';
      windowRef.value.style.width = width.value + 'px';
      windowRef.value.style.left = left.value + 'px';
      windowRef.value.style.top = top.value + 'px';
    }
    setTimeout(() => {
      windowRef.value.style.transition = '';
    }, 140);
  };
  /**
   * 最小化窗口
   */
  const minimize = () => {
    useStore.window.windowMinimize(window.name);
  };
  /**
   * 关闭窗口
   */
  const close = () => {
    useStore.window.windowRemove(window.name);
  };
  const windowActive = () => {
    useStore.window.windowActive(window.name);
  };
  onMounted(() => {
    init();
  });
  return {
    maximize,
    minimize,
    close,
    windowActive,
    active,
  };
};
